<!--预答辩申请-->
<template>
    <div class="edu-page-warp">
      <inner-breadcrumb v-model="pathKey" :path="path"></inner-breadcrumb>
      <div v-show="pathKey==='main'">
        <el-card shadow="never" body-style="padding: 24px;">
          <h2 class="edu-page-title">{{$t('preDefense.applyTable')}}</h2>
          <el-row style="margin-bottom:16px">
            <el-col :span="24">
              <div class="float-right">
                <el-button type="primary" @click="add({})">{{$t('message.apply')}}</el-button>
              </div>
            </el-col>
          </el-row>
          <edu-table ref="tables" :url="tableApi" :selection="false">
            <el-table-column :min-width="item.width" v-for="item in label" :key="item.props" :label="item.label"
                             :prop="item.props" show-overflow-tooltip></el-table-column>
            <el-table-column width="80" :label="$t('preDefense.auditState')" show-overflow-tooltip>
              <template slot-scope="scope">
                <el-tag v-for="item in options.status" v-show="scope.row.status===item.value" :key="item.value"
                        :type="item.type">{{item.label}}
                </el-tag>
              </template>
            </el-table-column>
            <el-table-column width="70" :label="$t('preDefense.grades')" prop="examResult" fixed="right" show-overflow-tooltip
                    :formatter="(row, column)=> { return fieldChange(this.options.examResult, row.examResult); }">
            </el-table-column>
            <el-table-column width="190px" :label="$t('nonPublicCourseOpen.operation')" fixed="right">
              <template slot-scope="scope">
                <div class="ReworkMana_btns" @click.stop="">
                  <el-button type="text" style="color:#ff5d0a"  v-if="(scope.row.status && scope.row.status !== 'UNPASS') && !scope.row.examResult"
                             @click="revokeFunc(scope.row)">{{$t('preDefense.revokeLabel')}}</el-button>
                  <el-button type="text" @click="open('preDefenseReport',scope.row)">{{$t('message.Look')}}
                  </el-button>
                  <!-- 审核通过之后，成绩录入之前都可以录入意见 -->
                  <el-button type="text" :disabled="scope.row.status!=='PASS' || scope.row.examResult"
                             @click="open('inputOption',scope.row)">{{$t('achievementApply.inputOption')}}
                  </el-button>
                  <el-button type="text" v-if="scope.row.status==='UNPASS'" @click="add(scope.row)">
                    {{$t('message.edit')}}
                  </el-button>
                  <!-- 导出word_申请表或结果表 -->
                  <el-button type="text" @click="exportWord(scope.row)">{{$t('message.export')}}
                  </el-button>
                </div>
              </template>
            </el-table-column>
          </edu-table>
        </el-card>
        </div>
        <!-- 申请 -->
        <el-dialog :visible.sync="dialogFlag" :title="titles" width="800px">
            <preDefenseApply v-if="dialogFlag" ref="preDefenseApply" :options="options" :row="rows" :yearTerms="yearTerms" @emit:back="backFunc"></preDefenseApply>
            <span slot="footer" class="dialog-footer">
                <el-button @click="dialogFlag = false">{{$t('message.cancel')}}</el-button>
                <el-button type="primary" @click="sure">{{$t('message.submit')}}</el-button>
            </span>
        </el-dialog>
      <!-- 录入意见 -->
        <inputOption ref="inputOption" v-if="pathKey==='inputOption'" :options="options" :row="rows" :detailsFlag="true" @emit:back="backFunc"></inputOption>
      <!-- 查看 -->
        <preDefenseReport v-if="pathKey==='preDefenseReport'" :options="options" :row="rows" @emit:back="backFunc" :detailsFlag="true"></preDefenseReport>
    </div>
</template>

<script>
import { applyExportDoc, applyTableList, auditReject } from "common/src/api/preDefense";
import preDefenseApply from './preDefenseApply';
import inputOption from './inputOption';
import calendars from 'common/src/api/calendars';
import preDefenseReport from './preDefenseReport';
import commonMixins from 'common/src/views/practiceManagement/commonMixins';
export default {
    components: {
        preDefenseApply,
        inputOption,
        preDefenseReport
    },
    mixins: [commonMixins],
    props: {},
    data() {
        return {
            tableApi: applyTableList,
            dialogFlag: false,
            rows: {},
            titles: '',
            label: [
              {label: this.$t('label.stuCode'), props: 'stuNo', width: 130},
              {label: this.$t('label.stuName'), props: 'stuName', width: 120},
              {label: this.$t('achievementApply.teacherName'), props: 'stuTutorName', width: 120},
              {label: this.$t('preDefense.submitTime'), props: 'createTime', width: 160},
            ],
            pathKey: 'main',
            path: {
              label: this.$t('preDefense.preDefenseApply'),
              key: 'main',
              disable: false,
              children: [
                { label: this.$t('achievementApply.inputOption'), key: 'inputOption', disable: true },
                { label: this.$t('message.Look'), key: 'preDefenseReport', disable: true },
              ]
            },
            options: {
              examResult: [
                { label: this.$t('message.pass'), value: 'PASS', type: 'success' },
                { label: this.$t('message.noPass'), value: 'UNPASS', type: 'danger' }
              ],
              status: [
                { label: this.$t('message.checking'), value: 'SUBMIT', type: '' },
                { label: this.$t('message.pass'), value: 'PASS', type: 'success' },
                { label: this.$t('achievementApply.refuse'), value: 'UNPASS', type: 'danger' },
              ],
              direction: []
            },
            yearTerms: '' // 学年学期
        };
    },
    computed: {

    },
    created() {

    },
    mounted() {
      let param = {
        X_YJFX: "direction" // 研究方向
      };
      this.initOptions(param);
      this.getYearTeam();
    },
    methods: {
        // 获取学年
        getYearTeam () {
          calendars.listAllCalendar()
          .then(res => {
            if (res.code === 200) {
              let currentYear = res.data.filter(v => v.currentTermFlag)[0];
              this.yearTerms = currentYear && currentYear.id
              this.getLists();
            }
          });
        },
        getLists() {  // 获取列表
          this.$refs.tables.pageNum = 1;
          this.$refs.tables.search({});
        },
        add(val) { // 申请/详情
          if (Object.keys(val).length === 0) {
            this.titles = this.$t('preDefense.preDefenseApply');
          } else {
            this.titles = this.$t('preDefense.preDefenseEdit');
          }
          this.rows = val;
          this.dialogFlag = true;
        },
        sure() { // 申请确定
          if (this.rows.id) {
            this.$refs.preDefenseApply.save('edit');
            return;
          }
          this.$refs.preDefenseApply.save();
        },
        // 申请撤回方法
        revokeFunc(row) {
            this.$confirm(this.$t('preDefense.revokeTips'), this.$t('preDefense.tipsTitle'), {
                confirmButtonText: this.$t('message.confirm'),
                cancelButtonText: this.$t('message.cancel'),
                type: 'warning'
            }).then(() => {
                let param = [row.id];
                auditReject(param).then(res=>{
                    if (res.code === 200) {
                        this.$message.success(this.$t('course.operateSuccess'));
                        this.getLists();
                    }
                });
            });
        },
        open(type, row) { // 打开页面
          this.pathKey = type;
          this.rows = row;
        },
        backFunc () {
          this.pathKey = 'main';
          this.dialogFlag = false;
          this.getLists();
        },
        exportWord(row) {
          let title = "预答辩申请表.doc"
          if(row.examResult){
            title = "预答辩结果表.doc"
          }
          //导出申请表或结果表
          applyExportDoc(row.id,title);
        },
    }
};
</script>

<style scoped lang="scss">
.con {
    &_title {
        width: 100%;
        border-bottom: solid #ccc 2px;
        padding: 20px;
        color: #2b3b4e;
        font-weight: bold;
    }
    &_content {
        display: flex;
        flex-direction: column;
    }
    &_apply {
        align-self: flex-end;
        margin-bottom: 10px;
    }
    &_status {
        border-bottom: solid #ccc 1px;
        display: block;
        padding: 5px 0;
        margin-bottom: 10px;
    }
}
.color {
    background-color: white;
}
.tab-title {
  padding-left: 24px;
  color: #2b3b4e;
  font-size: 18px;
}
</style>
